<link href="${rc.getContextPath()}/manage/css/dwzCustomCss/dwz.custom.css?v=${ver}" rel="stylesheet" type="text/css">
<link rel='stylesheet' href='${rc.getContextPath()}/manage/styles/colorPicker/spectrum.css' />
<style>
.dataPick span.error {
    position: absolute !important;
    left: 151px;
}

.sp-dd {
    background:
        url("${rc.getContextPath()}/manage/styles/dwz/themes/default/images/button/imgX.png");
    background-position: -163px -1px;
    height: 18px;
    width: 16px;
    position: absolute;
    right: 0px;
    top: 0px;
    border: 1px solid #D9DFE5;
}

.sp-replacer {
    padding: 0px;
    border: 0px !important;
    background: #EDF4F5 none repeat scroll 0% 0%;
    width: 146px;
    height: 24px;
    position: relative;
}

.sp-replacer.sp-active {
    border-color: #289BE5;
}

.sp-container,.sp-palette-container {
    border-color: #BDD7E7;
}

.sp-input {
    border: 1px solid #D9DFE5;
}

.sp-preview {
    width: 127px;
    height: 22px;
    border: 1px solid #D9DFE5;
    margin: 0px;
}

#periodTbody tr td div {
    height: 29px;
    padding-top: 3px;
}
</style>
<form method="post" action="${rc.getContextPath()}/manage/workDayType/saveWorkDayType" class=" pageForm required-validate" onsubmit="return workDayTypeJs._tsubmit(this);">
    <div class="pageContent">
        <div class="pageFormContent">
            <fieldset>
                <input type="hidden" name="navTabId" value="${navTabId!''}"> <input type="hidden" name="id" value="<#if (workDayType.dayTypeCode)??>${workDayType.dayTypeCode!''}</#if>">
                <dl>

                    <dt><@label key="dayTypeCode.C,colon">工作日类型编号：</@label></dt>
                    <dd>
                        <input class="required  alphanumeric toUp" name="dayTypeCode" value="<#if (workDayType.dayTypeCode)??>${workDayType.dayTypeCode!''}</#if>" type="text" maxlength="20"<#if (workDayType.dayTypeCode)??> readonly="readonly"<#else> remote="${rc.getContextPath()}/manage/workDayType/validateWorkDayType"</#if> warn="<@label key="workDayTypeCodeExist.M">工作日类型编号已经存在</@label>"/>
                    </dd>
                </dl>
                <dl>
                    <dt><@label key="dayTypeText.C,colon">工作日类型描述：</@label></dt>
                    <dd>
                        <input class="required" name="dayTypeText" value="<#if (workDayType.dayTypeText)??>${workDayType.dayTypeText!''}</#if>" type="text" maxlength="60" />
                    </dd>
                </dl>

                <dl>
                    <dt><@label key="displayColor.C,colon">显示颜色：</@label></dt>
                    <dd>
                        <input type='text' id="colorPicker" name="displayColor" value="${workDayType.displayColor!'#FF0000'}" />
                    </dd>
                </dl>
                <dl>
                    <dd>
                        <label><input type="checkbox" name="lockFlag" value="1"<#if (workDayType.lockFlag)?? && (workDayType.lockFlag == 1)> checked="true"</#if>><@label key="lockFlag.C">锁定标记</@label></label>
                    </dd>
                </dl>
                <dl class="nowrap">
                    <dd>

                        <div class="panel" currentIndex="0" eventType="click" style="width: 605px; margin: 0;">
                            <h1><@label key="workDayPeriod.C">工作时段</@label></h1>
                            <div>
                                <div id="bar" class="pBar">
                                    <ul class="toolBar">
                                        <li><a class="add" href="javascript:void(0);" onclick="workDayTypeJs._addRow();"> <span><@label key="add.B">新增</@label></span> </a>
                                        </li>
                                    </ul>
                                </div>
                                <table id="periodTable" class="table border canopration" width="600px"
                                    <#if (workDayType.dayTypeCode)??>layoutH="300"<#else>layoutH="230"</#if>>
                                    <thead>
                                            <tr>        
                                                <th width="200" style="padding-left: 3px;"><@label key="startTime.C">开始时间</@label></th>
                                                <th width="200"><@label key="endTime.C">结束时间</@label></th>
                                                <th width="80"><@label key="spanDays.C">跨天</@label></th>
                                                <th width="80"><@label key="nextDay.C">下一天</@label></th>
                                                <th ><@label key="opera.C">操作</@label></th>
                                            </tr>
                                        </thead>
                                        <tbody id="periodTbody">
                                            <#if workDayType.periods??&&(workDayType.periods?size>0) >
                                            <#list workDayType.periods as period>
                                            <tr style='height:30px'>
                                            <td style='position: relative;padding-left: 3px;height:30px;' class='dataPick'>
                                            <input type='text' name='periods[${period_index}].startTime' class='date textInput required' datefmt='HH:mm' value="${period.startTime!''}" readonly='true'><a class='inputDateButton' href='javascript:;'><@label key='select.B'>选择</@label></a>
                                            </td>
                                            <td style='position: relative;height:30px;' class='dataPick'>
                                            <input type='text' name='periods[${period_index}].endTime' class='date textInput required' datefmt='HH:mm' value="${period.endTime!''}" readonly='true'><a class='inputDateButton' href='javascript:;'><@label key='select.B'>选择</@label></a>
                                            </td>
                                            <td> 
                                            <input type='radio' name='periods[${period_index}].spanDaysFlag' value='1' onclick='workDayTypeJs._check(this)' <#if (period.spanDaysFlag)?? && (period.spanDaysFlag == 1)> checked="true"</#if>>
                                            </td>
                                            <td >
                                            <input type='radio' name='periods[${period_index}].spanDaysFlag' value='2' onclick='workDayTypeJs._check(this)' <#if (period.nextDayFlag)?? && (period.nextDayFlag == 1)> checked="true"</#if>>
                                            </td>
                                            <td><a title="<@label key='delete.B'>删除</@label>" class='btnDel' href='javascript:void(0)' onclick='workDayTypeJs._deleteRow(this);'><@label key='delete.B'>删除</@label></a></td></tr>
                                        </#list>
                                         </#if>
                                        </tbody>
                                    </table>
                            </div>
                        </div>
                    </dd>
                </dl>
            </fieldset>
        </div>
        <#if (workDayType.dayTypeCode)??> <#assign createInfo=workDayType/> <#include "/common/createInfo.html"> </#if>
        <div class="formBar">
            <ul>
                <li><div class="buttonActive" id="save">
                        <div class="buttonContent">
                            <button type="submit"><@label key="save.B">保存</@label></button>
                        </div>
                    </div>
                </li>
                <li>
                    <div class="buttonActiveGrey">
                        <div class="buttonContent">
                            <button type="button" class="close"><@label key="cancel.B">取消</@label></button>
                        </div>
                    </div></li>
            </ul>
        </div>
    </div>
</form>



<script type="text/javascript">
    $(function() {
        var dialog = $.pdialog.getCurrent();
        var colorPicker = $("#colorPicker", dialog);
        var colorVal = colorPicker.val();
        var colorOption = {
            color : colorVal,
            chooseText : "<@label key='select.C'>选择</@label>",
            cancelText : "<@label key='cancel.B'>取消</@label>",
            showInput : true,
            preferredFormat : "hex",
            showInput : true,
            showPalette : true,
            palette : [
                    [ "#000", "#444", "#666", "#999", "#ccc", "#eee",
                            "#f3f3f3", "#fff" ],
                    [ "#f00", "#f90", "#ff0", "#0f0", "#0ff", "#00f", "#90f",
                            "#f0f" ],
                    [ "#f4cccc", "#fce5cd", "#fff2cc", "#d9ead3", "#d0e0e3",
                            "#cfe2f3", "#d9d2e9", "#ead1dc" ],
                    [ "#ea9999", "#f9cb9c", "#ffe599", "#b6d7a8", "#a2c4c9",
                            "#9fc5e8", "#b4a7d6", "#d5a6bd" ],
                    [ "#e06666", "#f6b26b", "#ffd966", "#93c47d", "#76a5af",
                            "#6fa8dc", "#8e7cc3", "#c27ba0" ],
                    [ "#c00", "#e69138", "#f1c232", "#6aa84f", "#45818e",
                            "#3d85c6", "#674ea7", "#a64d79" ],
                    [ "#900", "#b45f06", "#bf9000", "#38761d", "#134f5c",
                            "#0b5394", "#351c75", "#741b47" ],
                    [ "#600", "#783f04", "#7f6000", "#274e13", "#0c343d",
                            "#073763", "#20124d", "#4c1130" ] ]
        };
        if (!colorPicker.spectrum) {
            var ctx = '${rc.getContextPath()}/manage';
            $.getScript(ctx + '/styles/colorPicker/spectrum.js', function() {
                //初始化颜色选择器
                colorPicker.spectrum(colorOption);
            });
        } else {
            colorPicker.spectrum(colorOption);
        }
        $('.sp-dd', dialog).empty();
    });

    var workDayTypeJs = {
        _addRow : function() {
            var gridTheadTh = $("#periodTable", $.pdialog.getCurrent()).find(
                    "table thead th");
            var statrtNum = $("#periodTable tbody tr", $.pdialog.getCurrent()).length;
            var row = "<tr style='height:30px'><td style='position: relative;padding-left: 3px;width:"
                    + $(gridTheadTh[0]).width()
                    + "px;' class='dataPick'><input type='text' name='periods["+statrtNum+"].startTime' class='date textInput required' datefmt='HH:mm' readonly='true'><a class='inputDateButton' href='javascript:;'><@label key='select.B'>选择</@label></a></td>"
                    + "<td style='position: relative; width:"
                    + $(gridTheadTh[1]).width()
                    + "px;' class='dataPick'><input type='text' name='periods["+statrtNum+"].endTime' class='date textInput required' datefmt='HH:mm' readonly='true'><a class='inputDateButton' href='javascript:;'><@label key='select.B'>选择</@label></a></td>"
                    + "<td style='width:"
                    + $(gridTheadTh[2]).width()
                    + "px;'><input type='radio' name='periods["
                    + statrtNum
                    + "].spanDaysFlag' value='1' onclick='workDayTypeJs._check(this)'></td>"
                    + "<td style='width:"
                    + $(gridTheadTh[3]).width()
                    + "px;'><input type='radio' name='periods["
                    + statrtNum
                    + "].spanDaysFlag' value='2' onclick='workDayTypeJs._check(this)'></td>"
                    + "<td style='width:"
                    + $(gridTheadTh[4]).width()
                    + "px;'>"
                    + "<a title='"
                    + "<@label key='delete.B'>删除</@label>'"
                    + " class='btnDel' href='javascript:void(0)' onclick='workDayTypeJs._deleteRow(this);'><@label key='delete.B'>删除</@label></a></td></tr>";
            var tobdy = $("#periodTbody", $.pdialog.getCurrent());
            tobdy.append(row);
            if ($.fn.datepicker) {
                $('tr:last input.date', $(tobdy)).each(function() {
                    var $this = $(this);
                    var opts = {};
                    if ($this.attr("dateFmt"))
                        opts.pattern = $this.attr("dateFmt");
                    if ($this.attr("minDate"))
                        opts.minDate = $this.attr("minDate");
                    if ($this.attr("maxDate"))
                        opts.maxDate = $this.attr("maxDate");
                    if ($this.attr("mmStep"))
                        opts.mmStep = $this.attr("mmStep");
                    if ($this.attr("ssStep"))
                        opts.ssStep = $this.attr("ssStep");
                    $this.datepicker(opts);
                });
            }
        },
        _deleteRow : function(a) {
            $(a).parents("tr").remove();
        },
        tempradio : null,
        _check : function(checkedRadio) {
            if (workDayTypeJs.tempradio == checkedRadio) {
                workDayTypeJs.tempradio.checked = false;
                workDayTypeJs.tempradio = null;
            } else {
                workDayTypeJs.tempradio = checkedRadio;
            }
        },
        _tsubmit : function(t) {
            var errorText="<@label key='periodExist.M'>时间段不能重叠！</@label>";
            var $form = $(t);
            if (!$form.valid()) {
                return false;
            }
            var tableData=new Array();
            var isOk=true;
             $("#periodTbody tr", $.pdialog.getCurrent()).each(function(trindex,tritem){
                    tableData[trindex]=new Array();
                    $(tritem).find("td").each(function(tdindex,tditem){
                        var text;
                        if(tdindex<2)
                        {
                        text=$(tditem).find("input").val();
                        tableData[trindex][tdindex]=text;
                        }
                        else if(tdindex<4)
                        {
                            if($(tditem).find("input")[0].checked||$(tditem).find("input")[0].selected)
                            {
                                text=1;
                            }
                            else
                            {
                                text=0;
                            }
                            tableData[trindex][tdindex]=text;
                        }
                    });
                   if(tableData[trindex][2]==0&&tableData[trindex][3]==0)
                       {
                          if(tableData[trindex][1]<=tableData[trindex][0])
                            {
                           alertMsg.warn("<@label key='the.C'>第</@label>"+(trindex+1)+"<@label key='periodErroe.M'>行结束时间必须大于开始时间！</@label>");
                           isOk=false;
                             return false;
                             }
                       }
                   if(tableData[trindex][3]==1)
                       {
                       if(tableData[trindex][1]<=tableData[trindex][0])
                         {
                           alertMsg.warn("<@label key='the.C'>第</@label>"+(trindex+1)+"<@label key='periodErroe.M'>行结束时间必须大于开始时间！</@label>");
                           isOk=false;
                              return false;
                          }
                       }
                       for(var i=0;i<tableData.length-1;i++){
                       if(tableData[i][2]==0&&tableData[i][3]==0)
                       {
                           if(tableData[trindex][2]==0&&tableData[trindex][3]==0)
                           {
                               if(tableData[trindex][1]<=tableData[i][0]||tableData[trindex][0]>=tableData[i][1])
                               {}
                               else
                               {
                                   alertMsg.warn(errorText);
                                   isOk=false;
                                      return false;
                               }
                           }
                           if(tableData[trindex][2]==1)
                            {
                               if(tableData[trindex][0]<tableData[i][1])
                                {
                                   alertMsg.warn(errorText);
                                   isOk=false;
                                      return false;
                                }
                            }
                       }
                       if(tableData[i][2]==1)
                       {
                           if(tableData[trindex][2]==0&&tableData[trindex][3]==0)
                           {
                               if(tableData[trindex][1]>tableData[i][0])
                                {
                                   alertMsg.warn(errorText);
                                   isOk=false;
                                      return false;
                                }
                           }
                               if(tableData[trindex][2]==1)
                                {
                                   if(tableData[trindex][0]>=tableData[i][0]||tableData[trindex][1]<tableData[i][1])
                                   {
                                       alertMsg.warn(errorText);
                                       isOk=false;
                                          return false;
                                   }
                                }
                               if(tableData[trindex][3]==1)
                               {
                                   if(tableData[trindex][0]<tableData[i][1])
                                   {
                                       alertMsg.warn(errorText);
                                       isOk=false;
                                          return false;
                                   }
                               }
                           }
                       if(tableData[i][3]==1)
                           {
                           if(tableData[trindex][2]==1)
                              {
                              if(tableData[trindex][1]>tableData[i][0])
                              {
                                  alertMsg.warn(errorText);
                                  isOk=false;
                                      return false;
                              }
                              }
                             if(tableData[trindex][3]==1)
                              {
                                if(tableData[trindex][1]<=tableData[i][0]||tableData[trindex][0]>=tableData[i][1])
                               {}
                               else
                               {
                                   alertMsg.warn(errorText);
                                   isOk=false;
                                      return false;
                               }
                              }
                           }
                       }
                      
                });
                
                if(!isOk)
                 {
                 return false;
                 }
                return validateCallback(t, dialogAjaxDone);
        }
    }
</script>
